<template>
  <div class="form-single-fragment" style="position: relative;">
    <div class="title clearfix">
      <el-button type="primary" size="mini" class="fr" @click="handleArchive">归档</el-button>
      <el-button type="primary" size="mini" class="fr" @click="addFromdata">创建成果文件</el-button>
    </div>
    <div class="table_container">
      <el-table :data="tableDate" size="mini" style="width: 100%;" header-cell-class-name="table-header-gray"  @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column type="index" align="center" width="55" label="序号"></el-table-column>
        <el-table-column prop="projectName" align="center" label="项目名称" show-overflow-tooltip></el-table-column>
        <el-table-column prop="task" align="center" label="文件/任务名称"></el-table-column>
        <!-- <el-table-column prop="accessoryList" align="center" label="附件">
          <template slot-scope="{row}">
            <span>{{row.accessoryList&&JSON.parse(row.accessoryList)&&JSON.parse(row.accessoryList).length>0?JSON.parse(row.accessoryList).map(item=>item.name).toString():''}}</span>
          </template>
        </el-table-column> -->
        <el-table-column prop="UserName" align="center" label="创建人"></el-table-column>
        <el-table-column prop="createTime" align="center" label="创建时间"></el-table-column>
        <el-table-column label="操作" align="center" width="160">
          <template slot-scope="scope">
            <el-button type="text" @click="handleInfo(scope.row)">详情</el-button>
            <el-button type="text" @click="handleEdit(scope.row)">编辑</el-button>
            <el-button type="text" @click="handleDelete(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { Administration } from '@/api/projectAdministration.js';
import Achievementsadd from './Achievementsadd.vue';
import AchievementsDetail from './AchievementsDetail.vue';
export default {
  name: 'Achievements',
  data () {
    return {
      loading: false,
      isShowloading: false,
      tableDate: [],
      multipleSelection: []// 列表选中项
    };
  },
  props: {
    projectId: {
      type: String,
      default: () => {
        return ''
      }
    },
    verifyStatus: {
      type: String,
      default: () => {
        return ''
      }
    }
  },
  mounted () {
    this.loadDetailWidgetData()
  },
  methods: {
    // 列表选中
    handleSelectionChange (val) {
      this.multipleSelection = val
      console.log(this.multipleSelection, 5555555)
    },
    // 归档
    handleArchive () {
      if (this.verifyStatus === 5) {
        Administration.addArchives(this, {approver: this.multipleSelection}).then(res => {
          if (res.success) {
            this.$message({
              message: '归档提交成功！',
              type: 'success'
            });
            // 设置归档成功后，返回上一级路由
            this.$router.go(-1)
          }
        })
      } else {
        Administration.updateArchives(this, {approver: this.multipleSelection}).then(res => {
          if (res.success) {
            this.$message({
              message: '归档提交成功！',
              type: 'success'
            });
            // 设置归档成功后，返回上一级路由
            this.$router.go(-1)
          }
        })
      }
    },
    /**
     * 项目成果
     */
    loadDetailWidgetData () {
      let params = {
        projectId: this.projectId,
        verifyStatus: this.verifyStatus
      };
      return new Promise((resolve, reject) => {
        Administration.achievement(this, params).then(res => {
          this.tableDate = res.data
          this.$forceUpdate()
        }).catch(e => {
          reject(e);
        });
      });
    },
    // 创建成果文件
    addFromdata (row) {
      let params = {
        projectId: this.projectId
      }
      this.$dialog.show('创建成果文件', Achievementsadd, {
        area: '600px'
      }, params).then(res => {
        this.loadDetailWidgetData()
      }).catch(e => {
      });
    },
    // 查看
    handleInfo (row) {
      console.log(row, 126)
      this.$dialog.show('成果文件详情', AchievementsDetail, {
        area: '600px'
      }, {
        achievement: row
      }).then(res => {
        this.loadDetailWidgetData()
      }).catch(e => {
      });
    },
    // 修改
    handleEdit (row) {
      let params = {
        projectId: this.projectId,
        achievement: row
      }
      this.$dialog.show('编辑成果文件', Achievementsadd, {
        area: '600px'
      }, params).then(res => {
        this.loadDetailWidgetData()
      }).catch(e => {
      });
    },
    // 删除
    handleDelete (row) {
      this.$confirm('确定要删除吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let params = {
          id: row.id
        }
        return new Promise((resolve, reject) => {
          Administration.achievementdelete(this, params).then(res => {
            this.loadDetailWidgetData()
          }).catch(e => {
            reject(e);
          });
        });
      })
    }
  }
}
</script>

<style lang="scss" scoped>
h3{border-bottom: 1px solid #E9E9EB;padding: 0 0 10px;}
.table_container{margin: 10px 0;}
.form-single-info{display: flex;justify-content: center;}
.title{
  display: flex;align-items: center;justify-content: flex-end;
  h4{font-weight: bold;}
}
.Taskslist{
  box-shadow: 0px 0px 7px 0px rgba(77, 165, 255, 0.3);border-radius: 0px 0px 4px 4px;padding: 10px 20px;
  display: flex;align-items: center;justify-content: space-between;
  h4{padding: 0;margin: 10px 0;font-weight: bold;}
  span{display: block;color: #409EFF;margin: 10px 0;}
  .color-text1{color: #F56C6C;}
  .color-text2{color: #C0C4CC;}
  .listimg{width: 60px;height: 60px;border-radius: 100%;overflow: hidden;}
  .listimg .el-image{width: 100%;height: 100%;}
}
</style>
